<template>
  <h1>大家好今天是星期一</h1>
  <p>{{info}}</p>
  <h3>{{info}}</h3>
  {{info+'早上好！'}}
  <hr>
  <button @click="f">按钮</button>
  <hr>
  <p>{{count}}</p>
  <button @click="f2">计数</button>
  <hr>
  <h4>{{x}}</h4>
  <h4 v-text="x"></h4>
  <h4 v-html="x"></h4>
</template>

<script setup>
import {ref} from "vue";

  const info=ref("我是info");
  const f=()=>{
    console.log(info.value);
    info.value="info的新值";
  }
  const count=ref(0);
  const f2=()=>{
    count.value++;
  }
  const x=ref('今天是星期二，又是一个<mark>晴天</mark>');
</script>

<style scoped>

</style>